<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>轻量级jquery数字动画插件</title>

	<style type="text/css">
		body{background-color: #222222; color: #fff}
		.container { margin:150px auto; max-width:480px;}
		h2,h3 { text-align:center;}
		.demo { text-align:center; margin-top:100px;}
		span.counter { display: block; margin: 20px auto; font-size: 64px; font-family: Arial; font-weight: bold; }
	</style>
</head>
<body>
	<div class="htmleaf-container">
		
		<div class="container">
		<h2>jQuery Countup.js Plugin Demo</h2>
		<h3>向下滚动页面 ↓</h3>
		<div class="demo">
		<span class="counter">1,498,547</span>
		<span class="counter">99.99</span>
		<span class="counter">1234567</span>
		</div>
		</div>
		
	</div>
	
	<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
	<script src="js/jquery.waypoints.min.js"></script>
	<script type="text/javascript" src="js/jquery.countup.min.js"></script>
	<script type="text/javascript">
		$('.counter').countUp();
	</script>
</body>
</html>